// compress: true, sourceMap: true
//  生成压缩css文件  生成地图，方便浏览器检查

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}
body {
  width: 1920px;
  background: url(../images/bg.jpg);
  color: #4694f9;
}
.panel {
  border: solid;
  // 设置盒子模型
  box-sizing: border-box;
  // 边框图片
  border-image-source: url(../images/border.png);
  // 边框宽度
  border-image-width: 52px 42px 27px 140px;
  // 边框图片截取
  border-image-slice: 52 42 27 140;
  // 边框图片平铺,这样不会出现断层的问题
  border-image-repeat: repeat;
}
.panel_title {
  height: 60px;
  display: flex;
  align-items: center;
  color: #fff;
  padding: 0 35px;
  .panel_h3 {
    font-weight: 400;
    font-size: 20px;
  }
  .line {
    width: 2px;
    height: 22px;
    background-color: #00dada;
    margin: 0 20px;
  }
  .dis_active {
    color: #0830bc;
  }
}

// 头部 logo
.header_logo {
  width: 100%;
}

// 内容
.container {
  display: flex;
  padding: 0 20px;
  margin-bottom: 20px;

  // 内容左边
  .container_left {
    width: 552px;
    margin-top: -24px;

    // 设备
    .device {
      height: 110px;
      display: flex;
      justify-content: space-around;
      align-items: center;
      .device_item {
        .device_number {
          font-size: 22px;
          color: #fff;
          font-weight: normal;
        }
        .device_text {
          font-size: 16px;
          margin-top: 5px;
        }
        &:nth-child(1) i {
          color: #006cff;
        }
        &:nth-child(2) i {
          color: #6acca3;
        }
        &:nth-child(3) i {
          color: #6acca3;
        }
        &:nth-child(4) i {
          color: #ed3f35;
        }
      }
    }

    // 故障设备监控
    .monitoring {
      height: 480px;
      margin: 20px 0;
    }

    // 点位分布统计
    .point {
      height: 340px;
    }
  }

  // 内容中间
  .container_center {
    flex: 1;
    margin: 0 20px;

    // 迁徙图
    .migrate_title {
      height: 60px;
      line-height: 60px;
      color: #fff;
      font-size: 25px;
      font-weight: 400;
      i {
        color: #68d8fe;
      }
    }
    .migrate_map {
      height: 527px;
      background-color: rgba(255, 255, 255, 0.2);
    }

    // 全国用户总量统计
    .user {
      height: 340px;
      margin-top: 20px;
    }
  }

  // 内容右边
  .container_right {
    width: 552px;
    margin-top: -24px;

    // 订单
    .order {
      height: 148px;
    }

    // 销售额
    .sale {
      height: 248px;
      margin: 20px 0;
    }

    // 渠道
    .distribute {
      display: flex;
      margin-bottom: 20px;

      // 渠道分布
      .channel {
        flex: 1;
        height: 232px;
        margin-right: 20px;
      }

      // 进度
      .progress {
        flex: 1;
        height: 232px;
      }
    }

    // 全国热榜
    .hot {
      height: 283px;
    }
  }
}
